<template>
  <div>
    <div class="deductionQuery" v-if="show1">
      <el-form inline label-width="100px" label-position="right">
        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="客户姓名：">
              <el-input v-model="khxm" placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="证件号码：">
              <el-input v-model="idNo" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="贷款合同号：">
              <el-input v-model="dkhth" placeholder=""></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="放款日期：">
              <el-date-picker
                v-model="loanActvDt"
                type="datetimerange"
                range-separator="-"
                start-placeholder=""
                end-placeholder=""
                style="width: 220px"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-form-item style="padding-top: 20px; float: left; width: 76px">
            <el-button type="primary" @click="queryInfo" size="large"
              >查询</el-button
            >
          </el-form-item>
          <el-form-item
            style="
              padding-top: 20px;
              width: 76px;
              float: left;
              padding-right: 120px;
            "
          >
            <el-button type="primary" @click="restAll" size="large"
              >重置</el-button
            >
          </el-form-item>
        </el-row>
      </el-form>
      <el-table
        :data="deductionQueryData"
        title="实时扣款查询列表"
        border
        height="300"
        stripe="true"
        style="width: 150%"
      >
        <el-table-column label="序号" width="50" type="index" />
        <el-table-column
          prop="contNo"
          label="贷款合同号"
          width="120"
          align="center"
        />
        <el-table-column
          prop="loanNo"
          label="贷款借据编号"
          width="120"
          align="center"
        />
        <el-table-column
          prop="custName"
          label="客户名称"
          width="120"
          align="center"
        />
        <el-table-column
          prop="idNo"
          label="证件号码"
          width="120"
          align="center"
        />
        <el-table-column
          prop="origPrcped"
          label="放款金额"
          width="120"
          align="center"
        />
        <el-table-column
          prop="dkqx"
          label="贷款期限"
          width="120"
          align="center"
        />
        <el-table-column
          prop="edje"
          label="放款日期"
          width="120"
          align="center"
        />
        <el-table-column
          prop="syed"
          label="是否逾期"
          width="120"
          align="center"
        />
        <el-table-column
          prop="docChannel"
          label="进件渠道"
          width="120"
          align="center"
        />
        <el-table-column
          prop="bchCde"
          label="所属机构"
          width="120"
          align="center"
        />
        <el-table-column label="操作" width="220" align="center">
          <template slot-scope="scope">
            <el-button size="mini" @click="handleApply(scope.$index, scope.row)"
              >扣款申请</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <!-- <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 40,50]"
          :page-size="10"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          style="float: right;">
        </el-pagination> -->
    </div>

    <div class="deductionApply" v-if="show2" style="width: 880px">
      <!-- 实时扣款申请页面 -->
      <el-form
        label-width="110px"
        label-position="right"
        :model="objForm_apply"
        :rules="rules2"
        ref="objForm_apply"
      >
        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="贷款合同号：" prop="contNo">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.contNo"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="贷款借据号：" prop="loanNo">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.loanNo"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="客户姓名：" prop="custName">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.custName"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="证件类型：" prop="idTyp">
              <el-input
                v-model="objForm_apply.idTyp"
                placeholder=""
                style="width: 140px"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="证件号码：" prop="idNo">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.idNo"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="扣款类型：" prop="cutPaymentType">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.cutPaymentType"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="当期应还金额：" prop="dqyhje">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.dqyhje"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="扣款金额：" prop="cutPaymentAmt">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.cutPaymentAmt"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="申请日期：" prop="applyDt">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.applyDt"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="银行账号：" prop="yhzh">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.yhzh"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :span="20">
          <el-col :span="10">
            <el-form-item label="诉讼费总金额：" prop="sumLegalFee">
              <el-input
                style="width: 140px"
                v-model="objForm_apply.sumLegalFee"
                placeholder=""
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-form-item style="padding-top: 30px; float: left; width: 100px">
            <el-button
              type="primary"
              @click="submit"
              size="large"
              style="width: 80px"
              >提交</el-button
            >
          </el-form-item>
          <el-form-item style="padding-top: 30px; width: 100px; float: left">
            <el-button @click="shut" size="large" style="width: 80px"
              >关闭</el-button
            >
          </el-form-item>
          <!-- <el-form-item style="padding-top: 30px;float: right;width: 100px;">
            <el-button  type="primary"  @click="save" size="large" style="width: 80px;">保存</el-button>
        </el-form-item> -->
        </el-row>
      </el-form>
    </div>
  </div>
</template>

  <script>
import {
  queryInfoCMIS100001,
  queryInfoCMIS100003,
  deductionCMIS410013,
  queryInfoCMIS100098,
} from "@/api/hubeixiaojin/queryInfo";

export default {
  name: "deductionQuery",
  props: ["data"],
  data() {
    return {
      khxm: "",
      idNo: "",
      dkhth: "",
      loanActvDt: "",
      //deductionQueryData:[{'loanNo':'1111'}],
      deductionQueryData: [],
      objForm: {},
      objForm_apply: {
        contNo: "",
        loanNo: "",
        custName: "",
        idTyp: "",
        idNo: "",
        cutPaymentType: "",
        dqyhje: "",
        cutPaymentAmt: "",
        applyDt: "",
        yhzh: "",
        sumLegalFee: "",
      },
      rules2: {
        loanNo: [{ required: true, message: "请输入借据号", trigger: "blur" }],
        cutPaymentType: [
          { required: true, message: "请输入扣款类型", trigger: "blur" },
        ],
        cutPaymentAmt: [
          { required: true, message: "请输入扣款金额", trigger: "blur" },
        ],
        applyDt: [
          { required: true, message: "请输入申请日期", trigger: "blur" },
        ],
        sumLegalFee: [
          { required: true, message: "请输入诉讼费总额", trigger: "blur" },
        ],
        yhzh: [{ required: true, message: "请输入银行账号", trigger: "blur" }],
      },
      show1: true,
      show2: false,
      total: 0,
      currentPage: 1,
    };
  },

  created() {
    console.log("实时扣款查询模块初始化：");
    var zjhm = sessionStorage.getItem("idNo"); //身份证号
    this.queryInfo(zjhm);
  },

  watch: {
    $route: function (to, from) {
      console.log("监听【实时扣款查询模块】route变化");
      this.$destroy();
    },
  },

  created() {
    console.log("实时扣款查询模块初始化：");
    var zjhm = sessionStorage.getItem("idNo"); //身份证号
    this.queryInfo(zjhm);
  },

  watch: {
    $route: function (to, from) {
      console.log("监听【实时扣款查询模块】route变化");
      this.$destroy();
    },
  },

  methods: {
    queryInfo(str) {
      let self = this;
      console.log("开始查询客户贷款基本信息");
      var param = {
        idNo: str,
      };
      if (this.idNo.length > 0) {
        param = {
          idNo: this.idNo, //身份证号
        };
      }
      if (param.idNo.length > 0) {
        //获取申请流水号列表
        var applSeqList = [];
        queryInfoCMIS100098(param)
          .then((res) => {
            console.log(res);
            if (res.retCode == "200") {
              console.log("调用CMIS100098接口成功");
              applSeqList = res.data;
              //遍历列表，调用CMIS100001接口获取贷款信息
              if (applSeqList.length > 0) {
                queryInfoCMIS100001(applSeqList)
                  .then((res2) => {
                    console.log("res2:");
                    console.log(res2);
                    if (res2.retCode == "200") {
                      console.log("查询成功,赋值deductionQueryData");
                      self.deductionQueryData = res2.data;
                    } else {
                      console.log("调用CMIS100001接口失败:");
                      window.globalUiKit.notify(
                        "提示",
                        "未查询到还款信息",
                        "info"
                      );
                    }
                  })
                  .catch((err) => {
                    window.globalUiKit.notify(
                      "提示",
                      "未查询到还款信息",
                      "error"
                    );
                    console.log("调用CMIS100001接口异常:");
                    console.log(err);
                  });
              } else {
                window.globalUiKit.notify(
                  "提示",
                  "未查询到还款信息，请联系管理员",
                  "info"
                );
              }
            } else {
              console.log("调用CMIS100098接口失败:");
            }
          })
          .catch((err) => {
            console.log("调用CMIS100098接口异常:");
            console.log(err);
          });
      } else {
        console.log("还款信息查询 异常：无身份证号");
        window.globalUiKit.notify("提示", "请填写身份证号", "info");
      }
    },

    queryInfo1111(str) {
      let self = this;
      console.log("开始查询客户贷款基本信息");
      var param = str;
      if (this.idNo.length > 0) {
        param = this.idNo;
      }
      console.log("开始查询 还款基本信息" + param);
      if (param.length > 0) {
        queryInfoCMIS100001(param)
          .then((res) => {
            if (res.retCode === "200") {
              console.log("测试测试测试");
              var resData = res.data;
              self.deductionQueryData = resData;
              // //循环调用CMIS100003接口获取 逾期标志
              // if(resData.length>0){
              //     resData.forEach(item => {
              //       var jjh = item.loanNo //循环遍历借据号
              //       var params_CMIS100003 = {}
              //       params_CMIS100003.loanNo = item.loanNo
              //       params_CMIS100003.userId = Agent.getCurrentAgent().agentId//操作用户
              //       params_CMIS100003.userName = Agent.getCurrentAgent().agentName//用户名称
              //       params_CMIS100003.userOrgNo = ''//用户机构
              //       params_CMIS100003.enqTyp = 'All'//查询类型
              //       queryInfoCMIS100003(params_CMIS100003)
              //         .then(res => {
              //           if(res.retCode==='200'){
              //             var psOdInd = res.data.lmPmShdList.lmPmShd.psOdInd //逾期标志
              //             if(psOdInd !='Y'){
              //               item.psOdInd = 'N'
              //             }else{
              //               item.psOdInd = 'Y'
              //             }
              //           }else{
              //             console.log("借据号为"+item.loanNo+"的逾期标志查询失败，请联系管理员")
              //           }
              //           this.deductionQueryData.push(item)
              //         })
              //   });
              // }
            } else {
              console.log(res.msg);
              window.globalUiKit.notify("提示", "未查询到还款信息", "info");
            }
          })
          .catch((err) => {
            window.globalUiKit.notify("提示", "未查询到还款信息", "info");
            console.log("调用CMIS100001接口发生异常" + err);
          });
      } else {
        console.log("还款信息查询 异常：无身份证号");
        window.globalUiKit.notify("提示", "请填写身份证号", "info");
      }
    },

    //扣款申请：
    handleApply(index, row) {
      this.show1 = false;
      this.show2 = true;
      //赋值列表
      this.objForm_apply.dkhth = row.contNo;
      this.objForm_apply.loanNo = row.loanNo;
      this.objForm_apply.custName = row.custName;
      this.objForm_apply.idTyp = row.idTyp;
      this.objForm_apply.idNo = row.idNo;
      this.objForm_apply.applyDt = row.applyDt;
    },

    //扣款申请 保存
    save() {
      console.log("保存");
    },

    //扣款申请 提交
    submit() {
      console.log("提交");
      this.$refs["objForm_apply"].validate((valid) => {
        if (valid) {
          //拼参数
          var params = {};
          params.loanNo = this.objForm_apply.loanNo; //贷款借据号
          params.cutPaymentType = this.objForm_apply.cutPaymentType; //扣款类型
          params.cutPaymentAmt = this.objForm_apply.cutPaymentAmt; //扣款金额
          params.applyDt = this.objForm_apply.applyDt; //申请日期
          params.sumLegalFee = this.objForm_apply.sumLegalFee; //诉讼费总额
          params.crtUsr = Constants.Agent.agentId; //发起人

          deductionCMIS410013(params)
            .then((res) => {
              console.log("测试CMIS410013 实时扣款接口");
              console.log(res);
              if (res.data.retCode === "200") {
                if (res.data.ec === "0000") {
                  window.globalUiKit.notify(
                    "提示",
                    "实时扣款申请成功",
                    "success"
                  );
                  //调用 关闭 方法，返回查询页面，清空表单
                  this.shut();
                  //查询页面重新调用查询方法（没有提供，先不调用了）
                  this.queryInfo();
                } else {
                  window.globalUiKit.notify(
                    "提示",
                    "实时扣款申请未成功，请联系管理员。",
                    "error"
                  );
                }
              } else {
                console.log("调用CMIS410013 实时扣款接口失败,res:" + res.msg);
                window.globalUiKit.notify(
                  "提示",
                  "实时扣款申请失败,请联系管理员",
                  "info"
                );
              }
            })
            .catch((err) => {
              console.log("调用CMIS410013接口发生异常" + err);
            });
        }
      });
    },
    //扣款申请 关闭
    shut() {
      console.log("关闭");
      this.show2 = false;
      this.show1 = true;
    },

    //切换当前页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
    //切换每页条数
    handleSizeChange_Claim1(val) {},

    restAll() {
      console.log("重置【实时扣款查询】页面数据");
    },
  },
};
</script>

  <style scoped>
/* .quotaAgreement .el-form-item{
      width: 282.5px;
    } */

.deductionApply .el-col {
  margin-top: 10px;
  width: 32%;
}

.deductionApply .el-col-10 {
  width: 32%;
}

.deductionQuery .el-col-10 {
  width: 35%;
}
</style>
